.border {
  border: 1px solid #e5e5e5;
}

.subjectManage {
  .subjectList {
    overflow: hidden;
    margin-top: 15px;
    .icon {
      width: 16px;
      height: 16px;
      border-radius: 50%;
      float: left;
      margin-right: 10px;
    }
    & > span {
      float: left;
    }
  }

  .titleTop {
    text-align: center;
    .col {
      background: #edf8ff;
      .border;
      line-height: 58px;
      height: 58px;
      color: #1c1c1c;
      font-size: 16px;
    }
  }

  .content {
    .titleLeft {
      text-align: center;
      color: #00b7ee;
      font-size: 22px;
      line-height: 160px;
      p {
        .border;
      }
    }

    .container {
      .subBox {
        .border;
        height: 162px;
        width: 20%;
        float: left;
        position: relative;

        .icon {
          width: 32px;
          height: 32px;
          border-radius: 50%;
          margin: calc(50% - 20px) auto;
        }

        .boxHover {
          width: 100%;
          height: 100%;
          position: absolute;
          top: 0;
          left: 0;

          .addSubject {
            display: none;
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
          }

          .handelBox {
            display: none;
            position: absolute;
            bottom: -1px;
            right: -1px;
            & > div {
              width: 32px;
              line-height: 38px;
              height: 32px;
              cursor: pointer;
              text-align: center;
              float: left;
            }
            .edit {
              background: #00b7ee;
            }
            .delete {
              background: #ff3b30;
            }
          }
        }

        .editSubject {
          width: 100%;
          height: 100%;
          background: #3ea8f7;
          position: absolute;
          top: 0;
          left: 0;

          .select {
            margin-left: 10%;
            margin-top: 45px;
            width: 80%;

            .optionIcon {
              display: block;
              float: left;
              width: 18px;
              height: 18px;
              border-radius: 50%;
              margin-right: 5px;
              margin-top: 4px;
            }
          }

          .buttonBox {
            width: 80%;
            margin-top: 20px;
            margin-left: 10%;

            .bt {
              width: 45%;
              background: #fff;
              color: #3ea8f7;

              &:last-child {
                margin-left: 10%;
              }
            }
          }
        }
      }
    }
  }
}

.select .optionIcon,
.ant-select-dropdown-menu-item .optionIcon {
  display: block;
  float: left;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  margin-right: 5px;
}
